package myJs.admin.viewTest

import myJs.CpLayer
import myJs.admin.testManage.TestManage
import myJs.admin.updateTest.UpdateTest
import myJs.api.Api
import myJs.cps._
import myJs.myPkg.{ReactRouterDOM, layer}
import myJs.tool.Tool
import org.scalajs.dom.{URLSearchParams, html}
import org.scalajs.macrotaskexecutor.MacrotaskExecutor.Implicits._
import slinky.core.FunctionalComponent
import slinky.core.annotations.react
import slinky.core.facade.Hooks.{useEffect, useState}
import slinky.core.facade.React
import slinky.web.html._
import myJs.Implicits._
import myJs.common.AppendViewCp
import shared.pojo.Sample._
import shared.pojo.Test._
import typings.csstype.csstypeStrings

/**
 * Created by yz on 21/1/2022
 */
@react object Cp {

  val curPage = ViewTest
  type Props = Unit

  val component = FunctionalComponent[Props] { props =>

    val location = ReactRouterDOM.useLocation()
    val searchParams = new URLSearchParams(location.search)
    val curId = searchParams.get("id").null2Int
    val initSampleId = searchParams.get("sampleId").null2Empty
    val initTestType = searchParams.get("testType").null2Empty
    val initCompany = searchParams.get("company").null2Empty

    val (idV, setIdV) = useState(curId)
    val (sampleId, setSampleId) = useState(initSampleId)
    val (testType, setTestType) = useState(initTestType)
    val (company, setCompany) = useState(initCompany)
    val initTestInfoData = TestInfoData(id = idV.toInt, info = List.empty[ProcessData])
    val (testData, setTestData) = useState(initTestInfoData)

    useEffect(() => {
      val options = Tool.layerOptions.copy(shade = List("0.1", "#fff"))
      val index = layer.load(0, options)
      val request = Get.Request(id = idV, sampleId = sampleId, testType = testType, company = company)
      Api.test.get(request).map { curTestInfoData =>
        setTestData(curTestInfoData)
        layer.close(index)
      }

    }, List()
    )

    val formRef = React.createRef[html.Form]

    object FTool {

    }

    CpLayer(title = curPage.titleStr)(
      div(className := "page-content",
        div(className := "row-fluid",
          div(className := "row",
            div(className := "col-md-12 col-sm-12",
              div(className := "portlet light",
                div(className := "portlet-title",
                  div(className := "item",
                    div(className := "title clear",
                      a(href := s"#${TestManage.absolutePath}", TestManage.titleStr), " / ",
                      span(curPage.titleStr)
                    )
                  ),
                ),
                div(className := "portlet-body",

                  form(className := "form-horizontal", id := "form", ref := formRef,

                    div(className := "form-group",
                      label(className := "control-label col-sm-2", "样本编号:"),
                      div(className := "col-sm-4",
                        p(className := "form-control-static", s"${testData.sampleId}")
                      )
                    ),

                    div(className := "form-group",
                      label(className := "control-label col-sm-2", "测试类型:"),
                      div(className := "col-sm-4",
                        p(className := "form-control-static", s"${testData.testType}")
                      ),
                      label(className := "control-label col-sm-2", "公司:"),
                      div(className := "col-sm-4",
                        p(className := "form-control-static", s"${testData.company}")
                      ),
                    ),

                    h4("流程"),

                    testData.info.sortBy(_.time).zipWithIndex.map { case (processData, curI) =>
                      div(key := s"${curI}",
                        div(style := Style(paddingRight = "5px", border = "1px solid silver", margin = "0 2px",
                          borderRadius = "4px"),
                          className := "northbtn myEachSoft",

                          div(className := "form-group",
                            label(className := "control-label col-sm-2", "时间:"),
                            div(className := "col-sm-3",
                              p(className := "form-control-static", s"${processData.time}")
                            ),
                            label(className := "control-label col-sm-2", "标题:"),
                            div(className := "col-sm-3",
                              p(className := "form-control-static", s"${processData.title}")
                            )
                          ),

                          div(className := "form-group",
                            label(className := "control-label col-sm-2", "内容:"),
                            div(className := "col-sm-8",
                              textarea(style := Style(width = "100%"), className := s"form-control fillByName",
                                value := s"${processData.content}", readOnly := true, rows := "3"
                              )
                            ),
                          ),

                          div(className := "form-group",
                            label(className := "control-label col-sm-2", "附件:"),
                            div(className := "col-sm-8",
                              AppendViewCp(serverFiles = processData.fileNames,
                                folder = processData.folder, id = testData.sampleId, testId = testData.id, show = true)

                            )
                          ),
                        ),
                        {
                          if (curI < testData.info.size - 1) {
                            div(style := Style(textAlign = csstypeStrings.center, marginTop = 10, marginBottom = 10,
                              fontSize = 16),
                              className := "myArrow",
                              i(className := "fa fa-angle-double-down")
                            )
                          } else null
                        }
                      )


                    },


                  ),

                  hr(),
                  div(className := "row",
                    div(className := "col-sm-5",
                      "进度信息有变动？点击此处", a(href := s"${UpdateTest.absolutePath}?id=${testData.id}", "修改信息")
                    )
                  )

                ),
              )
            ),

          ),

        )
      )
    )

  }


}
